<template>
  <div class="message-win" ref="message-wins" :style="{'display':displayStyle}">
    <div class="message-content-div">
      <BaseWin ref="message-slot">
        <div slot="content">{{displayMessage}}</div>
        <Button text="关闭" :click-function="closeWin" slot="foot"/>
      </BaseWin>
    </div>
  </div>
</template>

<script>
import BaseWin from "@/components/win/BaseWin";
import Button from "@/components/button/ButtonComponent";

export default {
  name: "MessageWinComponent",
  data(){
    return{
      displayStyle:'none',
      displayMessage:String
    }
  },
  props:{
    message:String
  },
  methods:{
    closeWin:function (){
      this.displayStyle = 'none';
    },
    showWin:function (){
      this.displayStyle = 'block';
    },
    setMessage:function (mes){
      if(null===mes){
        mes = "数据为空";
      }
      this.displayMessage = mes;
    }
  },
  mounted() {
    if(undefined!==this.message){
      this.displayMessage = this.message;
    }
  },
  components: {Button, BaseWin}
}
</script>

<style scoped>
.message-content-div{
  margin: auto;
  text-align: center;
}

</style>